<!--
  *  @Description:  首页
  *  @Author:  seadon
  *  @LastEditors:  zhaoxiaoyang  zhaoxiaoyang@byteluck.com
  *  @Date:  2021-07-07  11:14:50
  *  @LastEditTime:  2023-08-14  14:56:43
-->
<template>
	<a-layout class="pok-home">
        <a-layout  v-if="tenantDetail.information_module"  class="home-header">
            <a-row  type="flex"  class="header-row">
				<!--				<a-col  flex="auto"  class="news"  v-if="informationValue">-->
				<!--					<pok-news  />-->
                <!--				</a-col>-->
                <a-col  v-if="processValue"  flex="auto">
                    					<pok-home-user-info  />
                </a-col>
                <a-col  flex="340px">
                    <!--					<pok-user-info  v-if="processValue"  />-->

                  <a-layout class="content-sider"  width="340">
                    <section>
                      <pok-official-notification
                        v-if="informationValue"
                        :process-value="processValue"
                        :information-value="informationValue"
                      />
                    </section>
                    <section
                      v-if="processValue  &&  !informationValue"
                      class="sider-user-info"
                    >
                      <pok-user-info  />
                    </section>
                    <section
                      :class="{  'sider-recently':  processValue  &&  !informationValue  }"
                    >
                      <pok-recently  />
                    </section>
                    <section  class="sider-favorite">
                      <pok-favorite  />
                    </section>
                  </a-layout>
                </a-col>

            </a-row>
        </a-layout>
        <div
            class="home-content"
            :class="{  'home-top':  !tenantDetail.information_module  }"
        >
            <a-layout-content  class="application-center">
                				<pok-application-center  />
            </a-layout-content>

        </div>
    </a-layout>
    <div
        v-if="
			alertFlag  &&  user  !==  'sysadmin'  &&  environment  !==  'test'  &&  !isEEO()
		"
        class="cover"
    >
        <div  class="tip">
            <TipsPwd  :user-id="userId"  :tip-type="tipType"  @close="close"  />
        </div>
    </div>
    <ok-agreement
        v-if="showAgreementDialog  ===  'true'"
        type="confirm-dialog"
        device="desktop"
        .visible="showAgreementDialog"
        company-name="平台"
        @change="agreementClick"
    ></ok-agreement>
    <!--  此处由于vue3.1版本，还不支持wc组件的.语法  -->
    <!--  新版本提示  -->
    <NewVersionTips  v-if="showNewVersion"></NewVersionTips>
</template>

<script  setup  lang="ts">
import  {  apiInit  }  from  '@/services'
import  Mitt  from  '@/utils/tiny-mitt'
import  PokHomeUserInfo  from  './components/HomeUserInfo'
import  PokUserInfo  from  './components/UserInfo'
import  PokNews  from  './components/News'
import  PokOfficialNotification  from  './components/OfficialNotification'
import  PokFavorite  from  './components/Favorite'
import  PokRecently  from  './components/Recently'
import  PokApplicationCenter  from  '../ApplicationCenter'

import  {  createHomeContext  }  from  './hooks/useContext'
import  {  useStore  }  from  'vuex'
import  {  computed,  onMounted,  ref,  watch  }  from  'vue'
import  TipsPwd  from  './components/Tips/TipsPwd.vue'
import  {  useAgreement  }  from  '@/hooks/useAgreement'
import  NewVersionTips  from  '@/entry_desktop/components/NewVersionTips/NewVersionTips.vue'
import  checkPhone  from  '@/plugins/checkPhone'

const  alertFlag  =  ref(false)
const  store  =  useStore()

const  api  =  apiInit()
const  homeEmitter  =  new  Mitt()
const  tenantDetail  =  computed(()  =>  store.state.tenant)
const  Phone  =  ref('')
const  user  =  ref('')
const  isSetPwd  =  ref(false)
const  know:  any  =  ref(false)
const  userId:  any  =  ref('')
const  environment  =  ref('')
const  tipType:  any  =  ref([])
const  baitedaSecurityAccount  =  computed(
    ()  =>  store.state.tenant.tenant_auth.baiteda_security_account
)
const  informationValue  =  computed(()  =>  store.state.tenant.information_module)
const  processValue  =  computed(()  =>  store.state.tenant.process_quick_entry)
const  close  =  ()  =>  {
    alertFlag.value  =  false
}
createHomeContext({
    homeEmitter:  homeEmitter,
})
const  isEEO  =  ()  =>  {
    const  index  =  location.origin.indexOf('eeo-inc')
    return  index  >  -1
}
async  function  getIsShowSetPwd()  {
    try  {
        if  (
            baitedaSecurityAccount.value  ||
            store.state.tenant.login_types.split(',').includes('0')
        )  {
            //  let  result:  any,  getCenterUser
            //  ;[result,  getCenterUser]  =  await  Promise.all([
            //  	api.baseAuto.ListGuideUserPrivateV1POST({
            //  		payload:  ['org_pwd_has_set'],
            //  	}),
            //  	store.state.centerUser,
            //  ])
            //  const  result  =  await  api.baseAuto.ListGuideUserPrivateV1POST({
            //  	payload:  ['org_pwd_has_set'],
            //  })
            //  const  getCenterUser  =
            //  	await  api.default.GetCenterUserUserCenterPrivateV1GET({})
            const  getCenterUser  =  store.state.centerUser
            isSetPwd.value  =  getCenterUser?.user_base_info?.is_set_pwd
            Phone.value  =  getCenterUser?.user_base_info?.phone
            userId.value  =  getCenterUser?.user_base_info?.user_id
            know.value  =  getCenterUser?.show_set_pwd_notice

            let  flagUserCenter  =
                Phone.value  !==  ''  &&
                isSetPwd.value  ===  false  &&
                know.value  &&
                baitedaSecurityAccount.value

            let  flagOrgSetPwd  =
                !store.state.userInfo.has_set_pwd  &&
                !store.state.org_pwd_has_set  &&
                store.state.tenant.login_types.split(',').includes('0')
            if  (flagUserCenter  ||  flagOrgSetPwd)  {
                flagUserCenter  ?  tipType.value.push('userCenter')  :  void  0
                flagOrgSetPwd  ?  tipType.value.push('OrgSetPwd')  :  void  0
                alertFlag.value  =  true
            }
        }
    }  catch  (e)  {
        console.info('e',  e)
    }  finally  {
        console.info('iok')
    }
}
const  {
    tenantLogo,
    tenantName,
    showAgreementDialog,
    agreementClick,
    showNewVersion,
    editPasswordStatus,
}  =  useAgreement()
onMounted(async  ()  =>  {
    //  know.value  =  !!sessionStorage.getItem("isRead")  as  any
    user.value  =  store.state.userInfo.employee_name
    //  -test环境不提示设置密码
    environment.value  =  store.state.tenant.env_type
    checkPhone.checkPhone()
    //  nextTick(()=>{
    //  	store.commit('SET_SHOW_VERSION_TIPS_END',  true)
    //  })
})
watch(
    ()  =>  store.state.showPwdType,
    async  (newVal:  number)  =>  {
        if  (newVal  ===  2)  {
            await  getIsShowSetPwd()
        }
    }
)
watch(
    ()  =>  store.state.isShowPwd,
    async  (newVal:  boolean)  =>  {
        if  (newVal)  {
            await  getIsShowSetPwd()
        }
    }
)
</script>

<style  lang="less"  scoped>
.cover  {
    overflow:  hidden;
    position:  fixed;
    top:  0;
    left:  0;
    width:  100%;
    height:  100%;
    background:  rgba(94,  108,  157,  0.5);
    z-index:  9;
}

.tip  {
    position:  absolute;
    left:  50%;
    top:  50%;
    transform:  translate(-50%,  -50%);
}

.pok-home  {
    display:  flex;
    flex:  auto;
    flex-direction:  column;
    .home-header  {
        padding:  0;
        height:  150px;
        background:  transparent;
        .header-row  {
            height:  100%;

            //  color:  #fff;
            //  .user-info  {
            //  	background:  rgba(0,  146,  255,  0.75);
            //  }
            .ant-col  {
                height:  100%;
            }

            .news  {
                margin-right:  @rok-basic-margin;
                background:  @rok-white-bg;
                border-radius:  @rok-border-radius-big;
            }
        }
    }

    .home-content  {
        display:  flex;
        flex:  auto;
        margin-top:  @rok-basic-margin;
        padding-bottom:  20px;
        .content-sider  {
            margin-left:  @rok-basic-margin;
            background:  transparent;
            .sider-recently  {
                margin-top:  @rok-basic-margin;
            }
            .sider-favorite  {
                margin-top:  @rok-basic-margin;
            }
        }

        .application-center  {
            flex:  1;
            border-radius:  @rok-border-radius-big;
            max-width:  calc(100%  -  356px);
          position: relative;
        }
    }

    .home-top  {
        margin-top:  0;
    }
}
</style>
